<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
		<script type="text/javascript" src="../../js/boot.js"></script>
		<title></title>
	</head>

	<body>

		<div id="tabs1" class="mini-tabs" activeIndex="0" style="width:100%;height:100%;" bodyStyle="padding:0;border:0;">
			<div title="基础信息">
				<div id="basicForm">
					<table align="left">
						<tr>
							<td align="right">页面编号：</td>
							<td align="left"><input name="pageID" class="mini-textbox" enabled="false" width="260"></td>
							<td align="right">文件名称：</td>
							<td align="left"><input name="fileName" class="mini-textbox" width="260" /></td>
						</tr>
						<tr>
							<td align="right">存储路径：</td>
							<td>
								<input class="mini-treeselect" id="savePath" name="savePath" textField="label" valueField="path" parentField="parentID" checkRecursive="true" multiSelect="false" showFolderCheckBox="false"
								 expandOnLoad="0" showClose="true" oncloseclick="onCloseClick" popupWidth="300" style="width: 90%" />
							</td>
							<td align="right">说明：</td>
							<td align="left"><input name="remark" class="mini-textbox" width="260" /></td>
						</tr>
						<tr>
							<td align="right">模板类型：</td>
							<td align="left">
								<input name="templatType" class="mini-combobox" textField="text" valueField="id" data="templetTypes" width="260" />
							</td>
							<td align="right">模板名称：</td>
							<td>
								<input class="mini-treeselect" id="templetName" name="templetName" textField="label" valueField="path" parentField="parentID" checkRecursive="true" multiSelect="false" showFolderCheckBox="false"
								 expandOnLoad="0" showClose="true" oncloseclick="onCloseClick" popupWidth="300" style="width: 90%" />
							</td>
						</tr>
						<tr>
							<td align="right">表名称：</td>
							<td align="left">
								<input id="tableName_lookup" name="tableID" class="mini-lookup" style="width:260px;" textField="description" valueField="tableID" popupWidth="auto" popup="#tableNamePanel"
								 grid="#tableNameDatagrid" onshowpopup="tableNameDatagridOnShowPopup" onhidepopup="tableNameDatagridOnHidePopup" text="" value="" />
							</td>
							<td align="right">排序：</td>
							<td align="left"><input name="sequence" class="mini-spinner" minValue="1" /></td>
						</tr>
						<tr>
							<td align="center" colspan=4>
								<a class="mini-button mini-button-primary" onclick="doSave()">保存</a>
								<a class="mini-button mini-button-primary" onclick="doSave()">生成文件</a>
							</td>
						</tr>
					</table>
				</div>
			</div>

			<!--
	1、查询条件定义
		标题，
		名称，
		比较符：等于，小于，大于，小于等于，大于等于，相似，不等于，允许两个比较符
		数据类型：整型，字符串
		允许重复
		条件类型：必选，常用，高级
		顺序
-->
			<div title="查询定义">
				<div class="mini-fit">
					<div id="searchGrid" class="mini-datagrid" style="width:100%; height:100%;" showPager="false" idField="fieldID" allowResize="true" allowCellEdit="true" allowCellSelect="true"
					 editNextOnEnterKey="true" editNextRowCell="true">
						<div property="columns">
							<div field="+" value="+" width="20">+</div>
							<div field="index" type="indexcolumn" width="30"></div>
							<div name="name" field="name" displayField="description" headerAlign="center" width="120">字段名称
								<input property="editor" class="mini-lookup" style="width:100%;" minWidth="120" id="searchGrid_name_lookup" textField="description" valueField="fieldName" propertyField="propertyName"
								 value="" text="" popupWidth="auto" popup="#searchGridNameGridPanel" grid="#searchGridNameDatagrid" onshowpopup="searchGridNameOnShowPopup" onhidepopup="searchGridNameOnHidePopup"
								/>
							</div>
							<div name="dataType" field="dataType" headerAlign="center" width="80">数据类型
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="80" />
							</div>
							<div name="title" field="title" headerAlign="center" width="120">标题定义
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="120" />
							</div>
							<div name="property" field="property" headerAlign="center" width="120">属性定义
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="120" />
							</div>
							<div type="comboboxcolumn" autoShowPopup="true" name="conditionType" field="conditionType" width="60" align="center" headerAlign="center">条件类型
								<input property="editor" class="mini-combobox" style="width:100%;" data="conditionTypes" />
							</div>
							<div type="comboboxcolumn" autoShowPopup="true" name="comparison" field="comparison" width="60" align="center" headerAlign="center">比较符
								<input property="editor" class="mini-combobox" style="width:100%;" data="CONST.compareTypes" />
							</div>
							<div name="defaultValue" field="defaultValue" headerAlign="center" width="80">默认值
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="80" />
							</div>
							<div name="sequence" headerAlign="center" width="60">排序</div>
							<div field="-" value="-" width="20">-</div>
						</div>
					</div>
				</div>
			</div>
			<!--
	2、按钮定义：标题，名称，方法名称 ，方法定义，顺序
-->
			<div title="按钮定义">
				<div class="mini-fit">
					<div id="buttonGrid" class="mini-datagrid" style="width:40%;height:100%;" showPager="false" idField="fieldID" allowResize="true" allowCellEdit="true" allowCellSelect="true"
					 editNextOnEnterKey="true" editNextRowCell="true">
						<div property="columns">
							<div field="+" value="+" width="20">+</div>
							<div field="index" type="indexcolumn" width="30"></div>
							<div type="comboboxcolumn" autoShowPopup="true" name="name" field="name" width="100" align="center" headerAlign="center">方法名称
								<input property="editor" class="mini-combobox" style="width:100%;" data="CONST.buttonNames" />
							</div>
							<div name="sequence" headerAlign="center" width="60">排序</div>
							<div field="-" value="-" width="20">-</div>
						</div>
					</div>
				</div>
			</div>
			<!--
	3、列表定义：标题，名称，类型，顺序
-->
			<div title="列表定义">
				<div class="mini-fit">
					<div id="gridGrid" class="mini-datagrid" style="width:100%;height:100%;" showPager="false" idField="fieldID" allowResize="true" allowCellEdit="true" allowCellSelect="true"
					 editNextOnEnterKey="true" editNextRowCell="true">
						<div property="columns">
							<div field="index" type="indexcolumn" width="30"></div>
							<div name="propertyName" field="propertyName" headerAlign="center" width="150">名称
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="155" />
							</div>
							<div name="description" field="description" headerAlign="center" width="150">标题
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="155" />
							</div>
							<div name="format" field="format" headerAlign="center" width="150">格式
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="155" />
							</div>
							<div name="width" field="width" headerAlign="center" width="40">列宽
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="40" />
							</div>
							<div type="checkboxcolumn" field="used" trueValue="1" falseValue="0" width="30" headerAlign="center">显示</div>
							<div name="sequence" headerAlign="center" width="60">排序</div>
						</div>
					</div>
				</div>
			</div>
			<!--
	1、查询条件定义
		标题，
		名称，
		比较符：等于，小于，大于，小于等于，大于等于，相似，不等于，允许两个比较符
		数据类型：整型，字符串
		允许重复
		条件类型：
		顺序
	2、按钮定义：标题，名称，方法名称 ，方法定义，顺序
	3、列表定义：标题，名称，类型，顺序
	4、表单定义：标题，名称，类型，顺序
	5、模板输出定义
-->
			<div title="表单定义">
				<fieldset id="fd1" style="width: 97%; margin-bottom: 10px;">
					<legend><span>窗体设置</span></legend>
					<div id="formDefineForm" class="fieldset-body">
						<table class="form-table" border="0" cellpadding="0" cellspacing="0">
							<tr>
								<td class="form-label">
									<span>窗体宽度：</span>
									<input name="formWidth" class="mini-textbox" style="width: 150px" />
								</td>
								<td class="form-label">
									<span>窗体高度：</span>
									<input name="formHeight" class="mini-textbox" style="width: 150px" />
								</td>
								<td class="form-label">
									<span>每行列数：</span>
									<input name="colCount" class="mini-textbox" style="width: 150px" />
								</td>
							</tr>
						</table>
					</div>
				</fieldset>

				<div class="mini-fit">
					<div id="formGrid" class="mini-datagrid" style="width:100%;height:100%;" showPager="false" idField="fieldID" allowResize="true" allowCellEdit="true" allowCellSelect="true"
					 editNextOnEnterKey="true" editNextRowCell="true">
						<div property="columns">
							<div field="index" type="indexcolumn" width="30"></div>
							<div name="propertyName" field="propertyName" headerAlign="center" width="150">名称
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="155" />
							</div>
							<div name="description" field="description" headerAlign="center" width="150">标题
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="155" />
							</div>
							<div name="defaultValue" field="defaultValue" headerAlign="center" width="100">默认值
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="100" />
							</div>
							<div name="minValue" field="minValue" headerAlign="center" width="40">最小值
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="60" />
							</div>
							<div name="maxValue" field="maxValue" headerAlign="center" width="40">最大值
								<input property="editor" class="mini-textbox" style="width:100%;" minWidth="60" />
							</div>
							<div type="checkboxcolumn" field="used" trueValue="1" falseValue="0" width="30" headerAlign="center">显示</div>
							<div name="sequence" headerAlign="center" width="60">排序</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!--1号楼一层，13号，2点4点半，113房间-->
		<!--
	1、查询条件定义
		标题，
		名称，
		比较符：等于，小于，大于，小于等于，大于等于，相似，不等于，允许两个比较符
		数据类型：整型，字符串
		允许重复
		条件类型：
		顺序
	2、按钮定义：标题，名称，方法名称 ，方法定义，顺序
	3、列表定义：标题，名称，类型，顺序
	4、表单定义：标题，名称，类型，顺序
	5、模板输出定义
-->
		<div id="tableNamePanel" class="mini-panel" title="header" iconCls="icon-add" style="width:550px;height:400px;" showToolbar="true" showCloseButton="true" showHeader="false"
		 bodyStyle="padding:0" borderStyle="border:0">
			<div property="toolbar" style="padding:5px;padding-left:8px;text-align:center;">
				<div style="float:left;padding-bottom:2px;">
					<span>表名称 ：</span>
					<input id="tableNamePanelTableName" class="mini-textbox" style="width:160px;" onenter="onTableNamePanelSearchClick" />
					<a class="mini-button" onclick="onTableNamePanelSearchClick">查询</a>
				</div>
				<div style="float:right;padding-bottom:2px;">
					<a class="mini-button" onclick="onTableNamePanelCloseClick">关闭</a>
				</div>
				<div style="clear:both;"></div>
			</div>
			<div id="tableNameDatagrid" class="mini-datagrid" style="width:100%;height:100%;" borderStyle="border:0">
				<div property="columns">
					<div type="checkcolumn"></div>
					<div field="tableName" width="200" headerAlign="center" allowSort="true">表名称</div>
					<div field="sort" width="80" headerAlign="center" allowSort="true">分类</div>
					<div field="description" width="200" headerAlign="center" allowSort="true">表说明</div>
				</div>
			</div>
		</div>

		<div id="searchGridNameGridPanel" class="mini-panel" title="header" iconCls="icon-add" style="width:600px;height:400px;" visible="false" showToolbar="true" showCloseButton="true"
		 showHeader="true" bodyStyle="padding:0" borderStyle="border:0" showPageSize="false" showPageIndex="false">
			<div property="toolbar" style="padding:5px;padding-left:8px;text-align:center;">
				<span>字段名称：</span>
				<input id="searchGridNameFieldName" class="mini-textbox" style="width:160px;" onenter="searchGridNameOnSearchClick" />
				<a class="mini-button" onclick="searchGridNameOnSearchClick">Search</a>
				<a class="mini-button" onclick="onsearchGridPanelCloseClick">Clear</a>
			</div>
			<div id="searchGridNameDatagrid" class="mini-datagrid" style="width:100%;height:100%;" borderStyle="border:0" onRowclick="searchGridNameDatagridRowClick">
				<div property="columns">
					<div type="checkcolumn">#</div>
					<div field="fieldName" width="160" headerAlign="center" allowSort="true">字段名称</div>
					<div field="propertyName" width="160" headerAlign="center" allowSort="true">字段属性</div>
					<div field="type" width="90" headerAlign="center" allowSort="true">数据类型</div>
					<div field="description" width="160" headerAlign="center" allowSort="true">说明</div>
				</div>
			</div>
		</div>

	</body>

	<script type="text/javascript">
		templetTypes = [{
			id: "表格",
			text: "表格"
		}, {
			id: "表单",
			text: "表单"
		}, {
			id: "组合",
			text: "组合"
		}];

		conditionTypes = [{
			id: "常用",
			text: "常用"
		}, {
			id: "高级",
			text: "高级"
		}, {
			id: "必选",
			text: "必选"
		}];

		miniInit();

		function setData(data) {
			data = mini.clone(data);
			var pageID = data.pageID;
			http.get(http.getUrl("/plat/page/get.do?pageID=" + pageID), function(page) {
				var data = page.data;
				basicForm.setData(data);
				var content = mini.decode(data.data);
				searchGrid.setData(content.search);
				buttonGrid.setData(content.button);
				gridGrid.setData(content.grid);
				formGrid.setData(content.form);
				formDefineForm.setData(content.formDefineForm);
				var field = miniui.getFormField(basicForm, "tableID");
				debugger
				field.text = data.description;
				field.value = data.tableID;
				field.description = data.description;
			});
		}

		/************************************************************************
		 * 基础定义
		 ************************************************************************/
		var basicForm = new mini.Form("#basicForm"); // 基础信息表单
		//存储路径
		var savePath = mini.get("savePath");
		savePath.load(http.getUrl("/sys/menu/getHtmlPath.do"));
		//html模板文件
		var templetName = mini.get("templetName");
		templetName.load(http.getUrl("/sys/menu/getTempletHtml.do"));
		
		//表名称定义
		var tableNameDatagrid = mini.get("tableNameDatagrid");
		var tableNamePanelTableName = mini.get("tableNamePanelTableName");
		tableNameDatagrid.set({
			url: http.getUrl("/plat/table/page.do")
		});

		function tableNameDatagridOnShowPopup(e) {
			tableNameDatagrid.load();
		}

		function tableNameDatagridOnHidePopup(e) {
			debugger
			var data = e.source.data;
			if(data.length > 0) {
				var tableID = data[0].tableID;
				gridGrid.load({
					tableID: tableID
				});
				formGrid.load({
					tableID: tableID
				});
			}
		}

		function onTableNamePanelSearchClick(e) {
			tableNameDatagrid.load({
				tableName: tableNamePanelTableName.value,
				tableName_link: "like"
			});
		}

		function onTableNamePanelCloseClick(e) {
			var lookup = mini.get("tableName_lookup");
			lookup.hidePopup();
		}

		function doSave() {
			mini.mask({
				el: document.body,
				cls: 'mini-mask-loading',
				html: '数据保存中...'
			});
			var data = basicForm.getData();
			var search = miniui.getCleanGridData(searchGrid);
			var button = miniui.getCleanGridData(buttonGrid);
			var grid = miniui.getCleanGridData(gridGrid);
			var form = miniui.getCleanGridData(formGrid);
			var content = {};
			content["search"] = search;
			content["button"] = button;
			content["grid"] = grid;
			content["form"] = form;
			content["formDefineForm"] = formDefineForm.getData();
			debugger
			data["data"] = mini.encode(content);
			http.post(http.getUrl("/plat/page/save.do"), data, function(page) {
				mini.unmask();
				mini.alert("保存成功", "提示", null);
			});
		}

		/************************************************************************
		 * 查询定义列表
		 ************************************************************************/
		var searchGrid = mini.get("searchGrid");
		searchGrid.on("drawcell", function(e) {
			//action列，超连接操作按钮
			if(e.column.name == "sequence") {
				var uid = e.record._uid;
				e.cellStyle = "text-align:center";
				e.cellHtml = '<a href="javascript:searchGridMoveRow(\'' + uid + '\', -1)">上移</a>&nbsp; ' +
					'<a href="javascript:searchGridMoveRow(\'' + uid + '\', +2)">下移</a>';
			} else if(e.column.header == "+") {
				e.cellHtml = "+";
			} else if(e.column.header == "-") {
				e.cellHtml = "-";
			}
		});
		// 移动行数据
		function searchGridMoveRow(row_uid, count) {
			var row = searchGrid.getRowByUID(row_uid);
			var index = searchGrid.indexOf(row);
			searchGrid.moveRow(row, index + count);
		}
		// 标题栏点击事件
		searchGrid.on("headercellclick", function(e) {
			// 如果点击了标题栏的加号，则增加一行
			if(e.column.header == "+") {
				addSearchGridField(0);
			}
		});
		// 单元格点击事件
		searchGrid.on("cellclick", function(e) {
			var data = searchGrid.getSelected();
			var index = searchGrid.indexOf(data);
			var header = e.column.header;
			// 如果点击了加号一列的单元格，则在当前行下面增加一行
			if(header == "+") {
				addSearchGridField(index + 1);
			}
			// 如果点击了减号一列的单元格，则删除当前行
			else if(header == "-") {
				mini.confirm("确认删除该数据信息吗？", "删除操作", function(e) {
					if(e == "ok") {
						searchGrid.removeRow(data);
					}
				});
			}
		});
		// 在指定的行号处添加一行记录
		function addSearchGridField(index) {
			searchGrid.addRow({
				"+": "+",
				"-": "-",
				// "dataType": "变长文本",
				"conditionType": '常用',
				"comparison": '等于'
			}, index);
		}

		var searchGridNameDatagrid = mini.get("searchGridNameDatagrid"); // 字段名称选择弹出表格
		var searchGridNameFieldName = mini.get("searchGridNameFieldName"); // 字段名称选择弹查询字段名
		var searchGridSelectedRow = null; // 字段名称表格当前操作的行
		var searchGridNameDatagridRow = null; // 字段名称选择弹出表格当前操作的行
		searchGridNameDatagrid.set({
			url: http.getUrl("/plat/field/list.do")
		});
		// 查询定义配置页的字段名称列点击事件
		function searchGridNameOnSearchClick(e) {
			// 从基础配置中获取指定的表或视图编号
			var tableID = basicForm.getData().tableID;
			if(!tableID) {
				mini.alert("请先选择要操作的表或视图名称", "提示", null);
				return;
			}
			// 加载表对应包含的所有字段的定义
			searchGridNameDatagrid.load({
				tableID: tableID,
				fieldName: searchGridNameFieldName.value,
				fieldName_link: "like"
			});
		}
		// 查询定义配置页的字段名称选择弹出窗的关闭事件
		function onsearchGridPanelCloseClick(e) {
			var lookup = mini.get("searchGrid_name_lookup");
			lookup.hidePopup();
		}
		// 查询定义配置页的字段名称选择弹出窗事件
		function searchGridNameOnShowPopup(e) {
			//debugger
			searchGridSelectedRow = searchGrid.getSelected();
			searchGridNameOnSearchClick(e);
		}
		// 查询定义配置页的字段名称选择弹出窗的鼠标点击事件
		function searchGridNameDatagridRowClick(e) {
			debugger
			searchGridNameDatagridRow = searchGridNameDatagrid.getSelected();
			if(searchGridNameDatagridRow != null) {
				if(searchGridSelectedRow.title == null || searchGridSelectedRow.title == '') {
					searchGridSelectedRow.title = searchGridNameDatagridRow.description;
				}
				if(searchGridSelectedRow.property == null || searchGridSelectedRow.property == '') {
					searchGridSelectedRow.property = searchGridNameDatagridRow.propertyName;
				}
				searchGridSelectedRow.dataType = searchGridNameDatagridRow.type
			}
		}

		// 查询定义配置页的字段名称选择弹出窗关闭事件
		function searchGridNameOnHidePopup(e) {}

		/************************************************************************
		 * 按钮定义列表
		 ************************************************************************/
		var buttonGrid = mini.get("buttonGrid");
		buttonGrid.on("drawcell", function(e) {
			//action列，超连接操作按钮
			if(e.column.name == "sequence") {
				var uid = e.record._uid;
				e.cellStyle = "text-align:center";
				e.cellHtml = '<a href="javascript:buttonGridMoveRow(\'' + uid + '\', -1)">上移</a>&nbsp; ' +
					'<a href="javascript:buttonGridMoveRow(\'' + uid + '\', +2)">下移</a>';
			} else if(e.column.header == "+") {
				e.cellHtml = "+";
			} else if(e.column.header == "-") {
				e.cellHtml = "-";
			}
		});
		// 移动行数据
		function buttonGridMoveRow(row_uid, count) {
			var row = buttonGrid.getRowByUID(row_uid);
			var index = buttonGrid.indexOf(row);
			buttonGrid.moveRow(row, index + count);
		}
		// 标题栏点击事件
		buttonGrid.on("headercellclick", function(e) {
			// 如果点击了标题栏的加号，则增加一行
			if(e.column.header == "+") {
				addbuttonGridField(0);
			}
		});
		// 单元格点击事件
		buttonGrid.on("cellclick", function(e) {
			var data = buttonGrid.getSelected();
			var index = buttonGrid.indexOf(data);
			var header = e.column.header;
			// 如果点击了加号一列的单元格，则在当前行下面增加一行
			if(header == "+") {
				addbuttonGridField(index + 1);
			}
			// 如果点击了减号一列的单元格，则删除当前行
			else if(header == "-") {
				mini.confirm("确认删除该数据信息吗？", "删除操作", function(e) {
					if(e == "ok") {
						buttonGrid.removeRow(data);
					}
				});
			}
		});
		// 在指定的行号处添加一行记录
		function addbuttonGridField(index) {
			buttonGrid.addRow({
				"+": "+",
				"-": "-"
			}, index);
		}

		/************************************************************************
		 * 列表定义列表
		 ************************************************************************/
		var formDefineForm = new mini.Form("#formDefineForm"); // 基础信息表单
		var gridGrid = mini.get("gridGrid");
		gridGrid.set({
			url: http.getUrl("/plat/field/list.do")
		});
		gridGrid.on("drawcell", function(e) {
			//action列，超连接操作按钮
			if(e.column.name == "sequence") {
				var uid = e.record._uid;
				e.cellStyle = "text-align:center";
				e.cellHtml = '<a href="javascript:gridGridMoveRow(\'' + uid + '\', -1)">上移</a>&nbsp; ' +
					'<a href="javascript:gridGridMoveRow(\'' + uid + '\', +2)">下移</a>';
			}
		});
		// 移动行数据
		function gridGridMoveRow(row_uid, count) {
			var row = gridGrid.getRowByUID(row_uid);
			var index = gridGrid.indexOf(row);
			gridGrid.moveRow(row, index + count);
		}

		/************************************************************************
		 * 表单定义列表
		 ************************************************************************/
		var formGrid = mini.get("formGrid");
		formGrid.set({
			url: http.getUrl("/plat/field/list.do")
		});
		formGrid.on("drawcell", function(e) {
			//action列，超连接操作按钮
			if(e.column.name == "sequence") {
				var uid = e.record._uid;
				e.cellStyle = "text-align:center";
				e.cellHtml = '<a href="javascript:formGridMoveRow(\'' + uid + '\', -1)">上移</a>&nbsp; ' +
					'<a href="javascript:formGridMoveRow(\'' + uid + '\', +2)">下移</a>';
			}
		});
		// 移动行数据
		function formGridMoveRow(row_uid, count) {
			var row = formGrid.getRowByUID(row_uid);
			var index = formGrid.indexOf(row);
			formGrid.moveRow(row, index + count);
		}
	</script>

</html>